<template>
	<view class="container">
		<!-- 信息部分 -->
		<view class="topBox">
			<image src="../../static/images/user/touxiang.png" mode="" style="width: 96rpx;height: 96rpx;margin: 35rpx 0 43rpx 40rpx;" class="round"></image>
			<view class="number">
				<view>
					<text style="font-size: 26rpx;font-family: Source Han Sans CN;font-weight: 500;color: #333333;">账号：</text>
					<text style="font-size: 24rpx;font-family: Source Han Sans CN;font-weight: 400;color: #686868;"> admin</text>
				</view>
				<view style="font-size: 24rpx;font-family: Source Han Sans CN;font-weight: 400;color: #686868">
					污水厂/管理人员
				</view>
			</view>
		</view>
		<!-- 修改密码 -->
		<view class="password" @click="handleEditInfo">
			<image src="../../static/images/user/xiugaimima.png" mode="" style="width: 42rpx;height: 42rpx;margin-left: 49rpx;"></image>
			<text style="margin-left: 23rpx;font-size: 26rpx;font-family: Source Han Sans CN;font-weight: 400;color: #333333;">修改密码</text>
			<uni-icons type="forward" size="18" color="#7d7d7d" style="margin-left: 434rpx;"> </uni-icons>
		</view>
		<!-- 关于我们 -->
		<view class="aboutUs"  @click="handleAbout">
			<image src="../../static/images/user/guanyuwomem.png" mode="" style="width: 42rpx;height: 42rpx;margin-left: 49rpx;"></image>
			<text style="margin-left: 23rpx;font-size: 26rpx;font-family: Source Han Sans CN;font-weight: 400;color: #333333;">关于我们</text>
			<uni-icons type="forward" size="18" color="#7d7d7d" style="margin-left: 434rpx;"> </uni-icons>
		</view>
		
		<!-- 退出登录 -->
		<view class="logout" @click="handleLogout">
			退出登录
		</view>
		
	</view>
</template>

<script>
	import cookie from '@/cookie.js'
	
	export default{
		data(){
			return{
				
			}
		},
		computed:{
			avatar(){
				return this.$store.state.user.avatar
			}
		},
		methods:{
			handleAbout() {
				this.$tab.navigateTo('/pages/mine/about/index')
			},
			handleEditInfo(){
				this.$tab.navigateTo('/pages/mine/pwd/index')
			},
			
			//退出登录
			handleLogout(){
				cookie.remove('access_token')
				cookie.remove('robotid')
				cookie.remove('secretKey')
				cookie.remove('xjbh')
				cookie.remove('syjtask_id')
				cookie.remove('value1')
				cookie.remove('xjbgtask_id')
				this.$tab.reLaunch('/pages/login')
			}
		}
	}
	
</script>

<style lang="scss">
	*{
		margin: 0;
		padding: 0;
	}
	page{
		background-color: #f5f5f5;
	}
	.container{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.topBox{
		width: 710rpx;
		height: 174rpx;	
		background: #FFFFFF;
		border-radius: 10rpx;
		margin-top: 53rpx;
		display: flex;
		.number{
			width: 186rpx;
			height: 90rpx;
			margin-top: 46rpx;
			margin-left: 29rpx;
			// background-color: aquamarine;
		}
	}
	.password{
		width: 710rpx;
		height: 100rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 5rpx 6rpx 0rpx rgba(22,33,135,0.08);
		border-radius: 12rpx;
		margin-top: 55rpx;
		display: flex;
		// justify-content: center;
		align-items: center;
	}
	.aboutUs{
		width: 710rpx;
		height: 100rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 5rpx 6rpx 0rpx rgba(22,33,135,0.08);
		border-radius: 12rpx;
		margin-top: 20rpx;
		display: flex;
		align-items: center;
	}
	.logout{
		width: 549rpx;
		height: 72rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		background: #E5E5E5;
		border-radius: 36rpx;
		margin-top: 149rpx;
		font-size: 32rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #FE3A3A;
	}
</style>